<template>
	<view>
		<!-- 悬浮按钮-碰头室 -->
		<!-- v-if="ishome == 'user'" -->
		<view class="fixed-btn flex" @click="toGroupChat">
			<!-- ||hasMatchingValue(userStore.userInfo.id,applyAvatarList,'id') -->
			<image src="@/pages/activeDetail/static/images/talk.png" mode="widthFix"></image>
			<view class="talk-title">
				{{activeInfo.chat_title}}
			</view>
		</view>
		<view class="u-demo-block">
			<uv-swiper :height="311" :radius="0" @click="bindswiper" :list="list" keyName="url" imgMode="aspectFit"
				@change="e => current = e.current" :autoplay="true">
				<template v-slot:indicator>
					<view class="indicator">
						<view class="indicator__dot" v-for="(item, index) in list" :key="index"
							:class="[index === current && 'indicator__dot--active']">
						</view>
					</view>
				</template>
			</uv-swiper>
			<view class="detail-info">
				<view class="active-pepole-info">

					<view class="active-info">
						<view class="active-avatar" v-if="activeInfo.user_info" @click="toUserPage">
							<image class="avatar-img" v-if="activeInfo.user_info.avatar==''"
								src="@/static/images/avatar.png" mode="widthFix">
							</image>
							<image class="avatar-img" :src="baseurl+'/'+ activeInfo.user_info.avatar" mode="aspectFill"
								v-else>
							</image>
							<view class="zlr">
								主理人
							</view>
						</view>
						<view class="active-nick">
							<view class="nick">
								<view class="name" v-if="activeInfo.user_info">
									{{activeInfo.user_info.username=="微信用户"?'未知用户':activeInfo.user_info.username}}
								</view>
								<block v-if="activeInfo.user_info&&activeInfo.user_info.id!=userStore.userInfo.id">
									<view class="concern" @click="follower(0)"
										v-if="activeInfo.user_info&&activeInfo.user_info.follower==0">
										关注
									</view>
									<view class="y-concern" @click="follower(1)"
										v-if="activeInfo.user_info&&activeInfo.user_info.follower==1">
										已关注
									</view>
								</block>
							</view>
							<view class="age-box">
								<view class="age" v-if="activeInfo.user_info"
									:style="[{backgroundColor:(activeInfo.user_info.sex==1?'#D9EAFF':'#fff1f3')}]">
									<image v-if="activeInfo.user_info.sex==1"
										src="/pages/activeDetail/static/images/man.png" mode="widthFix"></image>
									<image v-if="activeInfo.user_info.sex==2"
										src="/pages/activeDetail/static/images/women.png" mode="widthFix"></image>
									<view class="age_noselect" v-if="activeInfo.user_info.age==''">
										<text>未知</text>
									</view>
									<text :class="[activeInfo.user_info.sex==1? 'man-age':'woman-age']"
										v-else>{{activeInfo.user_info.age}}后</text>
								</view>
								<view class="auth" v-if="activeInfo.user_info&&activeInfo.user_info.examine==0">
									未认证
								</view>
								<view class="self-auth" v-if="activeInfo.user_info&&activeInfo.user_info.examine==1">
									<image src="@/static/images/self.png" mode="widthFix"></image>
									<text class="self">个人</text>
								</view>
								<view class="qiye-auth" v-if="activeInfo.user_info&&activeInfo.user_info.examine==2">
									<image src="@/static/images/qiye.png" mode="widthFix"></image>
									<text class="qiye">企业</text>
								</view>
							</view>
						</view>
					</view>
					<button class="share-btn" open-type="share" plain
						style="margin: 0;border: none;padding:0;display: flex;line-height: 1;">
						<!-- <image src="https://tazisocializing.pusiyun.cn//applets/uploads/files/2024092318/0c9bc8c600956e105868010951f8967b.png" mode="widthFix"></image> -->
						<image src="@/static/images/share.png" mode=""></image>
						<text class="share" style="line-height: 1;">分享</text>
					</button>
					<!-- <view class="share-btn" @click="shareRef.open()" v-else>
						<image src="/pages/activeDetail/static/images/share.png" mode="widthFix"></image>
						<text class="share">分享</text>
					</view> -->
				</view>
				<view class="active-theme">
					<text class="active-type" user-select>
						{{activeInfo.type_text}}
					</text>
					<text class="active-title">{{activeInfo.title}}</text>
				</view>
				<view class="active-slogan">
					
					{{beforeText}}
					<text style="color:#19a4ff;">{{afterText}}</text>
				</view>
				<view class="active-time">
					<text>发布时间：{{activeInfo.createtime}}</text>
				</view>
				<view class="active-friend-info">
					<view class="" style="padding: 10rpx;">
						<view class="info-header">
							<view class="title">
								<image class="left-img" src="@/static/images/right_active.png" mode="aspectFill">
								</image>
								<text class="middle-title">正在找伴</text>
								<image class="right-img" src="@/static/images/left_active.png" mode="aspectFill">
								</image>
							</view>
							<view class="active-tips" v-if="activeInfo.near_tasks.data.length>=1">

								<text class="tips-notice">关联{{activeInfo.relation_task_total}}任务</text>
							</view>
						</view>
					</view>
					<view class="active-friend">

						<view class="" style="margin: 0 auto;" v-if="activeInfo.near_tasks.data.length==0">
							此活动暂无关联
						</view>
						<view class="active-friend-item" v-for="(it,index) in  activeInfo.near_tasks.data" :key="index"
							@click="gotaskDeatil(it.id)">
							<view
								style="display: flex;justify-content: space-between;align-items: center;font-size: 28rpx;margin-bottom: 15rpx;">
								<view style="margin-right: 15rpx;">

									<text>{{it.type_text}}</text>
								</view>
								<view class="" @click.stop="deatilTask(it,index)">
									<uv-icon name="close" size="12"></uv-icon>
								</view>
							</view>
							<view
								style="display: flex;justify-content: space-between;align-items: center;font-size: 24rpx;">
								<view style="margin-right: 14rpx;">
									<text>{{it.distance}}</text>
								</view>
								<view class="active-friend-right">
									<uv-icon name="arrow-right" size="10" color="#ffffff"></uv-icon>
								</view>
							</view>
						</view>
					</view>

				</view>

				<view class="active-detail-info">
					<view style="padding: 40rpx;">
						<view class="info-header">
							<view class="title">
								<image class="left-img" src="@/static/images/left_title.png" mode="aspectFill"></image>
								<text class="middle-title">活动信息</text>
								<image class="right-img" src="@/static/images/right_title.png" mode="aspectFill">
								</image>
							</view>
							<view class="active-tips" @click="upTips">
								<image src="/pages/activeDetail/static/images/tip.png" mode="widthFix"></image>
								<text class="tips-notice">活动须知</text>
							</view>
						</view>
						<view class="time-date">
							开始时间：{{activeInfo.start_at}}
						</view>
						<view class="time-date">
							结束时间：{{activeInfo.end_at}}
						</view>
						<view class="detail-address" @click="toMap">
							<view class="time-date" style="padding-top: 0;">
								<uv-text :customStyle="{fontSize:'28rpx',color: '#666666','max-width': '420rpx'}"
									:lines="1" :text="`集合地址：${activeInfo.address}`"></uv-text>
							</view>
							<view class="km-num">
								{{activeInfo.distance}}km
							</view>
						</view>
						<view class="time-date">
							性别要求：{{activeInfo.sex_text}}
						</view>
						<view class="time-date">
							活动费用：￥{{activeInfo.activity_money}}
						</view>
						<view class="time-date">
							仅剩名额 <text
								class="number">{{activeInfo.apply_number - activeInfo.after_apply_number >0 ?activeInfo.apply_number - activeInfo.after_apply_number: '名额已满'}}</text>
						</view>
						<view class="time-date">
							支付方式：{{activeInfo.money_type_text}}
						</view>

						<view class="enroll">
							<view class="enroll-number">
								已报名人数<text class="number">{{activeInfo.after_apply_number}}</text>
							</view>
							<view class="km-num" v-if="activeInfo.after_apply_number==activeInfo.apply_number">
								报名已满
							</view>
							<view class="km-num" @click="registerRef.open()">
								邀约一起同行 
							</view>

						</view>
						<view class="enroll-avator-box">
							<view class="enroll-avator">
								<view class="avator-group" v-for="(item,index) in applyAvatarList.slice(0,9)"
									:key="item.id">
									<image v-if="item!=''" :src="baseurl+'/'+item" mode="aspectFill"></image>
									<image v-if="item==''" src="@/static/images/avatar.png" mode="aspectFill"></image>
									<view class="ranking" v-if="index==0">
										<image src="/pages/activeDetail/static/images/one.png" mode="widthFix"></image>
									</view>
									<view class="ranking" v-if="index==1">
										<image src="/pages/activeDetail/static/images/two.png" mode="widthFix"></image>
									</view>
									<view class="ranking" v-if="index==2">
										<image src="/pages/activeDetail/static/images/three.png" mode="widthFix">
										</image>
									</view>
								</view>
							</view>
							<view class="more" v-if="applyAvatarList.length>=9">
								<image src="/pages/activeDetail/static/images/more.png" mode="widthFix"></image>
							</view>
							<view class="check-number" @click="registerRef.open()" v-if="applyAvatarList.length>0">
								<image src="/pages/activeDetail/static/images/detail.png" mode="widthFix"></image>
							</view>
						</view>
						<view v-if="activeInfo.isState&&ishome=='home'">
							<view class="application" style="background:#ccc">
								活动已结束
							</view>
						</view>
						<view v-else>
							<view class="strength"
								v-if="ishome=='home'&&activeInfo.after_apply_number==activeInfo.apply_number">
								报名人数已满
							</view>
							<view class="application" @click="apply"
								v-if="ishome === 'home' && activeInfo.after_apply_number !== activeInfo.apply_number">
								立即报名
							</view>
						</view>
						<!-- <view class="my-application" v-if="ishome=='user'&&activeInfo.is_main==0" @click="openMyApply">
							我的报名
						</view> -->
						<view class="my-application" v-if="ishome=='user'&&activeInfo.is_main==0">
							<view class="cancel-apply-btn" @click="openMyApply">
								取消报名
							</view>
							<view class="sign-apply-btn" @click="signApply">
								签到
							</view>
						</view>
						<view class="strength" v-if="activeInfo.is_main==1&&activeInfo.status==1">
							已取消
						</view>
						<view class="more-btns flex" v-if="activeInfo.is_main==1&&activeInfo.status==0">
							<view class="cancel-application" @click="cancelActiveRef.open()">
								取消活动
							</view>
							<view class="signin" @click="signCode">
								查看签到码
							</view>
						</view>
					</view>
				</view>
				<view>
					<view class="total-comment">
						共{{oneCommentList.length}}条评论
					</view>
					<view class="comment-kong" v-if="oneCommentList.length == 0">
						<view class="kong-icon">
							<image src="@/static/images/kong_comment.png" mode="widthFix"></image>
						</view>
						<view class="text-kong">
							暂无评论
						</view>
					</view>
				</view>
				<!-- 评论区 -->
				<view class="zwz-comment" v-if="oneCommentList.length > 0">
					<!-- <view class="comment-num">{{ comments.length == 0 ? '快来评论吧~' : comments.length + '条评论' }}</view> -->
					<scroll-view scroll-y="true" style="height: 800rpx;padding-bottom: 180rpx;" @scrolltolower="lower">
						<!-- 父层评论 -->
						<view class="comment-item-main" v-for="(item, index) in oneCommentList" :key="item.id"
							:id="index">
							<view class="comment-item">
								<view class="left">
									<image v-if="item.user_info.avatar!=''" :src="baseurl+'/'+item.user_info.avatar"
										class="img"></image>
									<image v-if="item.user_info.avatar==''" src="@/static/images/avatar.png"
										class="img"></image>
								</view>
								<view class="content">
									<view class="title-name">
										{{item.user_info.username=="微信用户"?'未知用户':item.user_info.username}}
									</view>

									<view class="content-text">
										<text>{{ item.content }}</text>
									</view>
									<view class="content-btm">
										<text>{{ item.createtime }}</text>
										<text class="btm-back"
											@click="replyComment(item.user_info.username, item.id)">回复</text>
									</view>
								</view>
								<view class="right">
									<view class="img-like" @click="commentLike(item)">
										<image src="/pages/activeDetail/static/images/aixin.png"
											v-if="item.self_like == 0"></image>
										<image src="/pages/activeDetail/static/images/aixin3.png" v-else></image>
										<text
											class="comment-like-num">{{ item.like_number == 0 || item.like_number == null ? '' : item.like_number }}</text>
									</view>
								</view>
							</view>
							<!-- 子层评论 -->
							<view v-if="showReplyList.indexOf(item.id) !== -1">
								<view class="comment-item items" v-for="reply in item.children" :key="reply.id">

									<view class="left">
										<image v-if="reply.user_info.avatar!=''"
											:src="baseurl+'/'+reply.user_info.avatar" class="img"></image>
										<image v-if="reply.user_info.avatar==''" src="@/static/images/avatar.png"
											class="img"></image>
									</view>
									<view class="content">
										<view class="title-name">
											<view>{{reply.user_info.username=="微信用户"?'未知用户':reply.user_info.username}}
											</view>
											<view v-if="reply.reply_info">回复</view>
											<view v-if="reply.reply_info">
												{{reply.user_info.username=="微信用户"?'未知用户':reply.user_info.username}}
											</view>
										</view>
										<view class="content-text">
											<text>{{ reply.content }}</text>
										</view>
										<view class="content-btm">
											<text>{{ reply.createtime }}</text>
											<text class="btm-back"
												@click="replyComment2(reply.user_info.username,reply.id,item.id)">回复</text>
										</view>
									</view>
									<view class="right">
										<view class="img-like" @click="commentLike(reply)">
											<image src="/pages/activeDetail/static/images/aixin.png"
												v-if="reply.self_like == 0"></image>
											<image src="/pages/activeDetail/static/images/aixin3.png" v-else></image>
											<text
												class="comment-like-num">{{ reply.like_number == 0 || reply.like_number == null ? '' : reply.like_number }}</text>
										</view>
									</view>
								</view>
							</view>
							<view class="spread" v-if="item.showReplyList" @click="isShowReply(item.id, index)">
								<text>收起内容</text>
							</view>
							<view class="spread" v-else @click="isShowReply(item.id, index)">
								<text v-if="item.snum>0">展开更多</text>
								<!-- {{'展开' + item.snum + '条回复'}} -->
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
			<view class="footer footer_flex" v-if="activeInfo.is_main==1">
				<view class="delete-btn flex" @click="delRef.open()">
					<!-- <image src="/pages/activeDetail/static/images/del.png" mode="widthFix"></image> -->
					<text class="del">删除</text>
				</view>
				<view class="delete-btn flex" style="border:1rpx solid #464646;" @click="bindEdit(activeInfo.id)">
					<!-- <image src="/pages/activeDetail/static/images/del.png" mode="widthFix"></image> -->
					<text class="del" style="color: #464646;">编辑</text>
				</view>
			</view>
			<view class="footer" v-else>
				<view class="input-comment">
					<view class="writer-icon">
						<image src="@/static/images/comment.png" mode="widthFix"></image>
					</view>
					<input class="input-box" :disabled="activeInfo.status==1" type="text" v-model="commentText"
						:placeholder="placeholderComment" :focus="iptFocus" @confirm="sendCourseComment" />

				</view>
				<!-- v-if="activeInfo.is_main==0" -->
				<view class="give-gift" @click="ToReward">
					<view class="gift-icon">
						<image src="@/static/images/gift.png" mode="widthFix"></image>
					</view>
					<view class="title">
						打赏
					</view>
				</view>
				<!-- 活动没取消 -->
				<block v-if="activeInfo.status==0">
					<view class="collent">
						<view class="collent-icon">
							
							<image src="@/static/images/collect.png" v-if="activeInfo.favorite==0" @click="favoriteActivity" mode="widthFix" >
							</image>
							<image src="@/static/images/y_collect.png" v-else @click="cancelFavoriteActivity" mode="widthFix"
								></image>
						</view>
						<view class="collent-number">
							{{activeInfo.favorite_count}}
						</view>
					</view>
					
					<view class="collent">
						<view class="collent-icon">
							<image src="@/static/images/love.png" v-if="activeInfo.like==0" @click="addLike" mode="widthFix" >
							</image>
							<image src="@/static/images/y_love.png" v-else mode="widthFix" @click="cancelLike"
								></image>
							
						</view>
						<view class="collent-number">
							{{activeInfo.like_count}}
						</view>
					</view>
				</block>
				<!-- 活动取消时收藏和喜欢不能点击 -->
				<block v-if="activeInfo.is_main==1&&activeInfo.status==1">
					<view class="collent">
						<view class="collent-icon">
							<image src="@/static/images/y_collect.png" mode="widthFix" v-if="activeInfo.favorite==1">
							</image>
							<image src="@/static/images/collect.png" mode="widthFix" v-else></image>
						</view>
						<view class="collent-number">
							{{activeInfo.favorite_count}}
						</view>
					</view>
					<view class="collent">
						<view class="collent-icon">
							<image src="@/static/images/y_love.png" mode="widthFix" v-if="activeInfo.like==1"></image>
							<image src="@/static/images/love.png" mode="widthFix" v-else>
							</image>
						</view>
						<view class="collent-number">
							{{activeInfo.like_count}}
						</view>
					</view>
				</block>
			</view>

		</view>
		<!-- 活动须知 -->
		<uv-popup :round="15" ref="showRef" mode="center" :closeOnClickOverlay="false" :safeAreaInsetBottom="false">
			<view class="tips-popup">
				<view class="tips-title">
					活动须知
				</view>
				<view class="tips-conent">
					<uv-parse :content="content"></uv-parse>

				</view>
				<view class="know-btn" @click="showRef.close()">
					知道了
				</view>
			</view>
		</uv-popup>
		<!-- 报名列表 -->
		<uv-popup :round="20" ref="registerRef" mode="bottom" :closeOnClickOverlay="false">
			<view class="register-popup">
				<view class="register-title">
					<view class="title">
						报名列表
					</view>
					<view class="del-btn" @click="registerRef.close()">
						<image src="../static/images/close.jpg" mode=""></image>
					</view>
				</view>
				<view class="register-statistics">
					<view class="flex">
						<view class="line-pink"></view>
						<view class="register-num">
							{{activeInfo.after_apply_number}}人已报名 |
							<text
								class="residue-num">还差{{activeInfo.apply_number - activeInfo.after_apply_number}}人</text>
						</view>
					</view>
					<view class="active-cancel" v-if="activeInfo.status==1">
						活动已取消
					</view>
				</view>
				<scroll-view scroll-y="true" style="height: 600rpx;" @scrolltolower="scrollPage">
					<view v-for="(item,index) in applyActiveList" :key="item.id">
						<view class="rank-list">
							<view class="avatar-box">
								<image v-if="item.user_info.avatar!=''" :src="baseurl+'/'+item.user_info.avatar"
									mode="aspectFill"></image>
								<image v-if="item.user_info.avatar==''" src="@/static/images/avatar.png"
									mode="aspectFill"></image>
								<view class="number-one" v-if="index==0">
									<image src="/pages/activeDetail/static/images/one.png" mode="widthFix"></image>
								</view>
								<view class="number-one" v-if="index==1">
									<image src="/pages/activeDetail/static/images/two.png" mode="widthFix"></image>
								</view>
								<view class="number-one" v-if="index==2">
									<image src="/pages/activeDetail/static/images/three.png" mode="widthFix"></image>
								</view>
							</view>
							<view class="rank-info">
								<view class="rank-item">
									<view class="nickname">
										{{item.user_info.username=="微信用户"?'未知用户':item.user_info.username}}
									</view>
									<view class="relationship" v-if="item.user_info.relationship==1">
										我的粉丝
									</view>
									<view class="relationship" v-if="item.user_info.relationship==2">
										我的关注
									</view>
									<view class="relationship" v-if="item.user_info.relationship==3">
										相互关注
									</view>
								</view>
								<view class="adress-info">
									<view class="age-tips"
										:style="[{backgroundColor:(item.user_info.sex==1?'#D9EAFF':'#fff1f3')}]">
										<image v-if="item.user_info.sex==1" src="@/static/images/man.png"
											mode="widthFix"></image>
										<image v-if="item.user_info.sex==2" src="@/static/images/women.png"
											mode="widthFix"></image>
										<view class="age_noselect" v-if="item.user_info.age==''">
											<text>未知</text>
										</view>
										<view v-else :class="[item.user_info.sex==1? 'man-age':'woman-age']">
											{{item.user_info.age}}后
										</view>

									</view>
									<view class="city-address">
										{{item.user_info.province_text}} {{item.user_info.city_text}}
									</view>
								</view>
							</view>
							<view class="invite-btns">
								<!-- <button open-type="share" class="btns" plain v-if="item.status=='1'">
									邀约同行
								</button> -->
								<view class="reason-btns" v-if="activeInfo.is_main!=1&&item.status=='1'"
									@click="toChat(`C2C${item.user_info.id}`,item.user_info.id)">
									邀他一起
								</view>
								<view class="reason-btns" v-if="activeInfo.is_main==1&&item.status=='1'"
									@click="rejectApply(item)">
									拒绝报名
								</view>
								<view class="reason-btns" v-if="activeInfo.is_main==1&&item.status=='3'">
									已拒绝
								</view>
								<view class="reason-btns" v-if="activeInfo.is_main==0&&item.status=='2'">
									已签到
								</view>
								<view class="money">
									打赏金额：<text
										class="money-num">{{item.tipping_amount==null?0:item.tipping_amount}}星光</text>
								</view>
							</view>
						</view>
						<!-- 签到人信息 -->
						<view class="sign-info" v-if="activeInfo.is_main==1">
							<text class="sign-name">姓名：{{item.name}}</text>
							<text class="sign-phone">联系电话：{{item.mobile}}</text>
							<text class="y-sign-state" v-if="item.status==2">已签到</text>
							<text class="n-sign-state" v-if="item.status==1">未签到</text>
						</view>
						<view class="reason" v-if="activeInfo.is_main==1&&item.apply_text!=''">
							附加信息：{{item.apply_text}}
						</view>
					</view>
				</scroll-view>
			</view>
			<!-- <uv-load-more :status="loadStatus" /> -->
		</uv-popup>
		<!-- 打赏 -->
		<uv-popup :round="20" ref="rewardRef" mode="bottom">
			<view class="register-popup">
				<view class="register-title">
					<view class="title">
						打赏
					</view>
					<view class="del-btn" @click="rewardRef.close()">
						<image src="../static/images/close.jpg" mode=""></image>
					</view>
				</view>
				<view class="register-statistics">
					<view class="register-num">
						打赏金额
					</view>
				</view>
				<view class="money-select-item">
					<view class="select-item" :class="[item.id==currentIndex ? 'active':'']"
						v-for="(item,index) in priceList" :key="item.id" @click="change(item.id)">
						<image class="money-img" src="/pages/activeDetail/static/images/money.png" mode="widthFix">
						</image>
						<view class="price">
							{{item.name}}星光
						</view>
					</view>
				</view>
				<view class="diy-price">
					<view class="image-icon">
						<image src="/pages/activeDetail/static/images/money.png" mode="widthFix"></image>
						<input class="input" type="number" placeholder="自定义金额" @input="amountInput" v-model="amount" />
					</view>
				</view>
				<view class="pay-account">
					<view class="" style="display: flex;">
					<view class="account-title">
						支付账户
					</view>
					<view class="" style="font-size:24rpx;color: #FE3052;" @click="toagree('城伴星光服务协议')">
						《城伴星光服务协议》
					</view>
						</view>
					<view class="account-price">
						<image src="/pages/activeDetail/static/images/money.png" mode="widthFix"></image>
						<text class="account">通用账户</text>
						<text class="price">{{totalmoney}}星光</text>
					</view>
					
				</view>
				<view class="reward-btn" @click="reward">
					打赏
				</view>
			</view>
		</uv-popup>
		<!-- 充值 -->
		<uv-popup ref="rechargeRef" mode="center" :round="15">
			<view class="register-popup" style="width: 630rpx;height: 456rpx;">
				<view class="register-title">
					<view class="title">
						提示
					</view>
					<view class="del-btn" @click="rechargeRef.close()">
						<image src="../static/images/close.jpg" mode=""></image>
					</view>
				</view>
				<view class="tips">
					余额不足,<text class="recharge">请充值</text>
				</view>
				<view class="recharge-btn">
					去充值
				</view>
			</view>
		</uv-popup>
		<!-- 我的报名 -->
		<!-- 		<uv-popup ref="myApplyRef" mode="center" :closeOnClickOverlay="false" :safeAreaInsetBottom="false" :round="15">
			<view class="register-popup" style="width: 630rpx;">
				<view class="register-title">
					<view class="title">
						我的报名
					</view>
					<view class="del-btn" @click="myApplyRef.close()">
						<image src="../static/images/close.jpg" mode=""></image>
					</view>
				</view>
				<scroll-view scroll-y="true" style="height: 750rpx;">
					<view class="select-cancel" style="padding: 30rpx;"
						v-for="(item,index) in activeInfo.activity_apply" :key="item.id">
						<view class="apply-info">
							<view class="name-phone">
								<text>{{item.name}}</text>
								<text style="padding-left: 20rpx;">{{item.mobile}}</text>
							</view>
							<view class="apply-reason">
								附加消息：{{item.apply_text}}
							</view>
							<view class="apply-reason" style="padding-top: 20rpx;color:#FE3052" v-if="item.status==3">
								拒绝理由：{{item.reason_text}}
							</view>
						</view>
						<view class="state" style="align-self: flex-start;color:#FE3052" v-if="item.status==3">
							被拒绝
						</view>
						<view class="state" style="align-self: flex-start;color:#FE3052" v-if="item.status==2">
							已签到
						</view>
						<view class="state" style="align-self: flex-start;color:#FE3052" v-if="item.status==1">
							未签到
						</view>
						<view class="state" style="align-self: flex-start;color:#FE3052" v-if="item.status==4">
							已取消
						</view>
					</view>
				</scroll-view>
				<view class="footer-btn" v-if="isHasApplyStatus!=undefined">
					<view class="cancel-apply" @click="cancelApply">
						取消报名
					</view>
					<view class="confirm" @click="signApply">
						签到
					</view>
				</view>
			</view>
		</uv-popup> -->
		<!-- 取消报名 -->
		<uv-popup ref="cancelApplyRef" mode="center" :round="15" :closeOnClickOverlay="false"
			:safeAreaInsetBottom="false">
			<view class="register-popup" style="width: 630rpx;">
				<view class="register-title">
					<view class="title">
						取消报名
					</view>
				</view>
				<view class="tips" style="padding: 60rpx 0 20rpx 0; ">
					选择用户取消报名
				</view>
				<view class="tips1">
					取消报名后，已支付报名费原路返回
				</view>
				<scroll-view scroll-y="true" style="max-height: 600rpx;">
					<view class="select-cancel" style="height: 154rpx;"
						v-for="(item,index) in activeInfo.activity_apply" :key="item.id">
						<view class="apply-info">
							<view class="name-phone">
								<text>{{item.name}}</text>
								<text style="padding-left: 20rpx;">{{item.mobile}}</text>
							</view>
							<view class="apply-reason">
								附加信息：{{item.apply_text}}
							</view>
						</view>
						<view class="select-img" @click="selectChange(item.id)" v-if="item.status==1">
							<image v-if="currentIndex2==item.id" src="@/pages/activeDetail/static/images/select.png"
								mode="widthFix"></image>
							<image v-else src="@/pages/activeDetail/static/images/no_select.png" mode="widthFix">
							</image>
						</view>
						<view class="select-img" style="align-self: flex-start;padding-top: 30rpx;color: #FE3052;"
							v-if="item.status==4">
							已取消
						</view>
						<view class="select-img" style="align-self: flex-start;padding-top: 30rpx;color: #FE3052;"
							v-if="item.status==2">
							已签到
						</view>
						<view class="select-img" style="align-self: flex-start;padding-top: 30rpx;color: #FE3052;"
							v-if="item.status==3">
							被拒绝
						</view>
					</view>
				</scroll-view>

				<view class="footer-btn">
					<view class="cancel" @click="cancelApplyRef.close()">
						取消
					</view>
					<view class="confirm" @click="trueCancelApply">
						确定
					</view>
				</view>
			</view>
		</uv-popup>
		<!-- 取消活动 -->
		<uv-popup ref="cancelActiveRef" mode="center" :round="15" :closeOnClickOverlay="false"
			:safeAreaInsetBottom="false">
			<view class="register-popup" style="width: 630rpx;">
				<view class="register-title">
					<view class="title">
						提示
					</view>
				</view>
				<view class="tips" style="padding: 100rpx 0 20rpx 0; ">
					是否取消该活动？
				</view>
				<view class="tips1">
					取消活动后，已支付报名费原路返回
				</view>
				<view class="footer-btn">
					<view class="cancel" @click="cancelActiveRef.close()">
						取消
					</view>
					<view class="confirm" @click="trueCancelActive">
						确定
					</view>
				</view>
			</view>
		</uv-popup>
		<!-- 分享 -->
		<!-- 		<uv-popup :round="20" ref="shareRef" mode="bottom">
			<view class="register-popup">
				<view class="register-title">
					<view class="title">
						分享到
					</view>
					<view class="del-btn" @click="shareRef.close()">
						<image src="../static/images/close.jpg" mode=""></image>
					</view>
				</view>
				<view class="share-to">
					<view class="from-app">
						<button open-type="share" plain style="border: 0;font-size: 0;">
							<image src="/pages/activeDetail/static/images/weixin.png" mode="widthFix"></image>
							<view class="app-name">
								微信
							</view>
						</button>

					</view>

					<view class="from-app">
						<button open-type="share" plain style="border: 0;font-size: 0;">
							<image src="/pages/activeDetail/static/images/quan.png" mode="widthFix"></image>
							<view class="app-name">
								朋友圈
							</view>
						</button>
					</view>
					<view class="from-app">
						<button open-type="share" plain style="border: 0;font-size: 0;">
							<image src="/pages/activeDetail/static/images/weibo.png" mode="widthFix"></image>
							<view class="app-name">
								微博
							</view>
						</button>
					</view>
				</view>
			</view>
		</uv-popup> -->
		<!-- 签到 -->
		<uv-popup ref="signRef" mode="center" :round="15" :closeOnClickOverlay="false" :safeAreaInsetBottom="false">
			<view class="register-popup" style="width: 630rpx;">
				<view class="register-title">
					<view class="title">
						签到
					</view>
				</view>
				<view class="tips" style="padding: 60rpx 0 20rpx 0; ">
					选择用户进行签到
				</view>
				<view class="tips1">
					签到后，不可取消报名
				</view>
				<scroll-view scroll-y="true" style="max-height: 600rpx;">
					<view :style="{'height':currentIndex2==item.id?'278rpx':''}"
						style="background-color: #f6f6f6;border-radius: 20rpx;"
						v-for="(item,index) in activeInfo.activity_apply" :key="item.id">
						<view class="select-cancel2">
							<view class="apply-info">
								<view class="name-phone">
									<text>{{item.name}}</text>
									<text style="padding-left: 20rpx;">{{item.mobile}}</text>
								</view>
								<view class="apply-reason">
									附加信息：{{item.apply_text}}
								</view>
							</view>
							<view class="select-img" @click="selectChange(item.id)" v-if="item.status==1">
								<image v-if="currentIndex2==item.id" src="@/pages/activeDetail/static/images/select.png"
									mode="widthFix"></image>
								<image v-else src="@/pages/activeDetail/static/images/no_select.png" mode="widthFix">
								</image>
							</view>
							<view class="select-img" style="align-self: flex-start;padding-top: 30rpx;color: #FE3052;"
								v-if="item.status==4">
								已取消
							</view>
							<view class="select-img" style="align-self: flex-start;padding-top: 30rpx;color: #FE3052;"
								v-if="item.status==2">
								已签到
							</view>
							<view class="select-img" style="align-self: flex-start;padding-top: 30rpx;color: #FE3052;"
								v-if="item.status==3">
								被拒绝
							</view>
						</view>
						<view
							style="display: flex;align-items: center;border-radius: 20rpx;height: 100rpx;width: 510rpx;margin: auto;background-color: #fff;padding: 0 20rpx;"
							v-if="currentIndex2==item.id">
							<uv-input placeholder="请输入签到码" border="none" v-model="code"></uv-input>

							<uv-qrcode ref="qrcode" size="90rpx" @click="qropen"
								:value="baseurl+ '/'+ SignQrcode"></uv-qrcode>
						</view>

					</view>
				</scroll-view>
				<view class="footer-btn">
					<view class="cancel" @click="signRef.close()">
						取消
					</view>
					<view class="confirm" @click="trueSign">
						确认签到
					</view>
				</view>
			</view>
		</uv-popup>
		<!-- 查看二维码 -->
		<uv-popup ref="qrcodeRef" mode="center" :round="15" :closeOnClickOverlay="false" :safeAreaInsetBottom="false"
			:customStyle="{
		        'overflow': 'hidden',
		        'position': 'fixed',  
		        'z-index': 9999       
		    }">
			<!-- 弹窗内容容器（禁止滚动） -->
			<view class="register-popup" style="
		        width: 630rpx;
		        height: 636rpx;
		        position: relative;
		        overflow: hidden; 
		        background: #fff;
		        border-radius: 15rpx;
		    ">
				<!-- 标题栏（固定在顶部） -->
				<view class="register-title" style="
		            position: absolute;
		            top: 0;
		            left: 0;
		            right: 0;
		            padding: 30rpx;
		            z-index: 10;
		            background: #fff;
		            display: flex;
		            justify-content: space-between;
		            align-items: center; ">
					<view class="title" style="font-size: 32rpx; font-weight: bold;">
						签到二维码
					</view>
					<view class="del-btn" @click="qrcodeRefclose">
						<image src="../static/images/close.jpg" style="width: 30rpx; height: 30rpx;"></image>
					</view>
				</view>

				<!-- 二维码容器（绝对居中，禁止滚动） -->
				<view class="code-img" style="
		            position: absolute;
		            top: 45%;
		            left: 50%;
		            transform: translate(-50%, -60%);
		            width: 400rpx;
		            height: 400rpx;
		            z-index: 1;
		        ">
					<image :src="baseurl+ '/'+ SignQrcode"
						style="position: static !important;display: block;margin: 0 auto;width: 400rpx;height: 400rpx;"
						mode=""></image>
					<!-- <uv-qrcode 
		                ref="qrcode" 
		                size="400rpx" 
		                :value="baseurl+ '/'+ SignQrcode"
		                :customStyle="{
		                    'position': 'static !important',  
		                    'display': 'block',
		                    'margin': '0 auto'
		                }"
		            ></uv-qrcode> -->
				</view>
			</view>
		</uv-popup>
		<!-- 查看签到码 -->
		<uv-popup ref="codeRef" mode="center" :round="15" :closeOnClickOverlay="false" :safeAreaInsetBottom="false">
			<view class="register-popup" style="width: 630rpx;">
				<view class="register-title">
					<view class="title">
						活动签到码
					</view>
					<view class="del-btn" @click="codeRef.close()">
						<image src="../static/images/close.jpg" mode=""></image>
					</view>
				</view>
				<view class="code-img flex">
					<image src="@/pages/activeDetail/static/images/code.png" mode="widthFix"></image>
				</view>
				<view class=""style="font-size: 32rpx;text-align: center;color: #222222;font-weight: 700;" >
					<text >	{{'《'+ activeInfo.title +'》'}}</text>
				
				</view>
				<view class="code-number">
					<text style="color: #222222;font-size: 32rpx;">	签到码：</text>
				{{signcode}}
				</view>
				<view class="copy-btn" @click="copy">
					一键复制
				</view>
			</view>
		</uv-popup>
		<!-- 拒绝报名 -->
		<uv-popup ref="rejectRef" mode="center" :round="15" :closeOnClickOverlay="false" :safeAreaInsetBottom="false">
			<view class="register-popup" style="width: 630rpx;">
				<view class="register-title">
					<view class="title">
						提示
					</view>
				</view>
				<view class="reject-tip" style="font-size: 32rpx;font-weight: bold;padding-top: 60rpx;">
					是否拒绝该用户的报名？
				</view>
				<view class="reject-tip">
					拒绝用户报名后，已支付报名费原路退回
				</view>
				<view class="reject-title">
					拒绝理由
				</view>
				<view
					style="display: flex;align-items: center;margin-top: 20rpx;background-color: #f6f6f6;height: 112rpx;border-radius: 20rpx;">
					<uv-input placeholder="请输入拒绝理由" border="none" v-model="rejectReason"></uv-input>
				</view>

				<view class="footer-btn">
					<view class="cancel" @click="rejectRef.close()">
						取消
					</view>
					<view class="confirm" @click="trueReject">
						确定
					</view>
				</view>
			</view>
		</uv-popup>
		<!-- 删除活动 -->
		<uv-popup ref="delRef" mode="center" :round="15" :closeOnClickOverlay="false" :safeAreaInsetBottom="false">
			<view class="register-popup" style="width: 630rpx;">
				<view class="register-title">
					<view class="title">
						提示
					</view>
				</view>
				<view class="tips" style="padding: 100rpx 0 20rpx 0; ">
					是否删除该活动？
				</view>
				<view class="footer-btn">
					<view class="cancel" @click="delRef.close()">
						取消
					</view>
					<view class="confirm" @click="delActive">
						确定
					</view>
				</view>
			</view>
		</uv-popup>
	</view>
</template>

<script setup>
	import TencentCloudChat from "@tencentcloud/chat";
	import {
		onLoad,
		onReachBottom,
		onShareAppMessage,
		onShareTimeline,
		onShow
	} from '@dcloudio/uni-app'
	import {
		throttle,
		unique4
	} from '@/utils/utils.js';
	import {
		reactive,
		ref,
		inject,
		computed
	} from 'vue';
	import {
		useActiveStore
	} from '@/store/modules/active.js'
	import {
		useUserStore
	} from '@/store/modules/user.js'
	const status = ref(false)
	const userStore = useUserStore()
	const activeStore = useActiveStore()
	const showReplyList = reactive([])
	const currentIndex = ref(1)
	const placeholderComment = ref('说点什么...')
	const iptFocus = ref(false)
	const showRef = ref()
	const registerRef = ref()
	const rewardRef = ref()
	const rechargeRef = ref()
	const cancelApplyRef = ref()
	const cancelActiveRef = ref()
	const delRef = ref()
	const signRef = ref()
	const codeRef = ref()
	const qrcodeRef = ref()
	const shareRef = ref()
	const rejectRef = ref()
	const myApplyRef = ref()
	const priceList = ref([])
	const list = ref([])
	const current = ref(0)
	const activeId = ref(0)
	const user_apply_id = ref()
	const activeInfo = ref({})
	const page = ref(1)
	const loadStatus = ref('loadmore')
	const applyActiveList = ref([]) //报名活动列表
	const applyAvatarList = ref([]) //报名头像列表
	const applyTotal = ref(0) //报名总数
	const baseurl = ref('')
	const content = ref('') //活动须知内容
	const commentPage = ref(1)
	const commentLoadStatus = ref('loadmore')
	const commentText = ref('') //评论输入的内容
	const oneCommentList = ref([])
	const moreCommentList = ref([])
	const morePage = ref(1)
	const parentId = ref(0) //回复父级的id
	const indexs = ref(0)
	const amount = ref(10)
	const totalmoney = ref(0)
	const currentIndex2 = ref(0)
	const signcode = ref('')
	const rejectReason = ref('') //拒绝理由
	const applyId = ref('') //活动的报名id
	const userId = ref('') //报名用户id
	const ishome = ref('') //是否是从首页-精选活动、首页-搜索、首页-组局活动进入
	const isflag = ref(false) //是否是从首页-精选活动、首页-搜索、首页-组局活动进入
	const ApplyActivityUserInfoList = ref([]) //单个用户报名参加活动的信息列表
	const code = ref('') //签到码
	const oneDeepId = ref('') //一级评论的Id
	const isHasApplyStatus = ref('')
	const chat2 = inject('$chat')
	const longitude = ref('0')
	const latitude = ref('')
	const moreTotal = ref('')
	const SignQrcode = ref('') //二维码
	const close1 = ref(true)
	onLoad((option) => {
		baseurl.value = uni.getStorageSync('baseUrl')
		page.value = 1
		applyActiveList.value = []
		activeId.value = option.activeId
		ishome.value = option.ishome
		isflag.value = option.flag
		uni.getLocation({
			type: 'wgs84',
			success: (res) => {
				longitude.value = res.longitude
				latitude.value = res.latitude
			},
			fail: (err) => {
				uni.$uv.toast('定位失败')
			}
		});
		setTimeout(() => {
			if (option.flag == 'true') {
				// console.log(666,'打开签到');
				signRef.value.open()
				currentIndex2.value = 0
				code.value = ''
			}
		}, 1000)

	})
	onShow(() => {
		getActiveDetail()
		getApplyActiveList()
		getOneCommentList()
	})
	const qropen = () => {

		signRef.value.close()
		qrcodeRef.value.open()

	}
	const qrcodeRefclose=()=>{
		qrcodeRef.value.close()
		signRef.value.open()
	}
	onShareAppMessage((res) => {
		if (res.from === 'button') { // 来自页面内分享按钮
			console.log(res.target)
		}
		let info = JSON.parse(uni.getStorageSync('user'));
		if (info && info.userInfo) {
			userStore.visitShareCount({
				share_user_id: info.userInfo.id
			}).then(res => {
				console.log(666, res);
			})
		}
		return {
			title:`${activeInfo.value.type_text}|${activeInfo.value.title}`,
			path: `/pages/activeDetail/detail/index?activeId=${activeInfo.value.id}`,
			imageUrl: '/static/images/banner.png'
		}

	})
	onShareTimeline(() => {
		return {
			title:`${activeInfo.value.type_text}| ${activeInfo.value.title}`,
			path: `/pages/activeDetail/detail/index?activeId=${activeInfo.value.id}`,
			imageUrl: '/static/images/banner.png',

		};
		// imageUrl: uni.getStorageSync('baseUrl') + '/' + activeInfo.value.images[0]
	})
	// 单聊
	const toChat = (conversationID, userId) => {
		uni.navigateTo({
			url: `/TUIKit/components/TUIChat/index?conversationID=${conversationID}` + '&userId=' + userId
		});
	}
	const isTimeEnded = (startTime, endTime) => {
		// 将传入的时间字符串转换为 Date 对象
		const startDate = new Date(startTime);
		const endDate = new Date(endTime);
		const currentDate = new Date(); // 获取当前时间

		// 验证结束时间是否早于当前时间
		if (currentDate > endDate) {
			return true; // 已结束
		} else {
			return false; // 未结束
		}
	}
	// 顶部轮播看大图
	const bindswiper = (e) => {
		let lists = Object.values(list.value);
		console.log(lists);
		console.log(lists[e]);
		uni.previewImage({
			current: lists[e],
			urls: lists,
		});
	}
	// 导航
	const toMap = () => {
		uni.openLocation({
			latitude: Number(activeInfo.value.lat),
			longitude: Number(activeInfo.value.lng),
			name: activeInfo.value.address,
			success: function() {
				console.log('success');
			},
			fail: (err) => {
				console.log('err', err);
			}
		});
	}
	const bindEdit = (e) => {
		uni.navigateTo({
			url: `/pages/release/organize/index?id=${e}`
		})
	}
	const beforeText = computed(() => {
		if(activeInfo.value.desc){
			const index =activeInfo.value.desc.indexOf('#');
			return index === -1 ? activeInfo.value.desc : activeInfo.value.desc.slice(0, index);
		}
	 
	});
		
	const afterText = computed(() => {
		if(activeInfo.value.desc){
			const index = activeInfo.value.desc.indexOf('#');
			return index === -1 ? '' : activeInfo.value.desc.slice(index);
		}
	 
	});
	// 获取活动详情
	const getActiveDetail = async () => {
		let params = {
			user_activity_id: activeId.value,
			lat: uni.getStorageSync('latitude'),
			lng: uni.getStorageSync('longitude')
		}
		if (ishome.value == 'home') {
			// 从首页进入走这个接口
			var res = await activeStore.homeActiveDetail(params,uni.getStorageSync('token'))
		} else {
			// 从我的发布、我的报名进入走这个接口
			var res = await activeStore.getUserActivityDetail(params,uni.getStorageSync('token'))
		}
		if (res.code == 200) {
			list.value = []
			if (res.data) {
				res.data.isState = isTimeEnded(res.data.start_at, res.data.end_at)
			}
			activeInfo.value = res.data
			// if (ishome.value == 'user' && activeInfo.value.is_main == 0) {
			// 	// 判断是否存在报名、未签到的数据
			// 	isHasApplyStatus.value = res.data.activity_apply.find(item => {
			// 		return item.status == 1
			// 	})
			// }
			let imagesList = []
			let videoList = []
			res.data.images.forEach(item => {
				imagesList.push(uni.getStorageSync('baseUrl') + '/' + item)
			})
			res.data.video.forEach(item => {
				videoList.push(uni.getStorageSync('baseUrl') + '/' + item)
			})
			list.value = list.value.concat(imagesList, videoList)
		}
	}
	// 获取参加活动的报名列表
	const getApplyActiveList = async () => {
		loadStatus.value = 'loading'
		let res = await activeStore.getApplyActiveList({
			user_activity_id: activeId.value,
			page: page.value
		})
		if (res.code == 200 && res.data) {
			// 报名总数
			// applyTotal.value = res.data.total
			if (page.value == 1) {
				applyActiveList.value = res.data.data
			} else {
				applyActiveList.value = applyActiveList.value.concat(res.data.data)
			}
			// map出报名列表中的头像列表
			applyAvatarList.value = applyActiveList.value.map(item => {
				return item.user_info.avatar
			})
			// 判断是否还有数据
			if (res.data.current_page >= res.data.last_page) {
				loadStatus.value = 'nomore'
			} else {
				loadStatus.value = 'loadmore'
			}
		} else {
			loadStatus.value = 'nomore'
		}
	}
	const toagree = (text) => {
		uni.navigateTo({
			url: '/pages/login/agreement/index?title=' + text
		})
	}
	// 触底加载更多
	const scrollPage = () => {
		if (loadStatus.value == 'nomore') {
			return uni.$uv.toast('没有更多了~')
		}
		page.value++
		getApplyActiveList()
	}
	// 获取1级深度评论
	const getOneCommentList = async () => {
		commentLoadStatus.value = 'loading'
		let res = await activeStore.getOneCommentList({
			user_activity_id: activeId.value,
			page: commentPage.value
		})
		if (res.code == 200 && res.data) {
			if (commentPage.value == 1) {
				oneCommentList.value = res.data.data
			} else {
				oneCommentList.value = oneCommentList.value.concat(res.data.data)
			}
			// 判断是否还有数据
			if (res.data.current_page >= res.data.last_page) {
				commentLoadStatus.value = 'nomore'
			} else {
				commentLoadStatus.value = 'loadmore'
			}
		} else {
			commentLoadStatus.value = 'nomore'
		}
	}
	// 获取更多评论
	const getMoreCommentList = async (id) => {
		let res = await activeStore.getMoreCommentList({
			comment_id: id,
			// page: morePage.value
		})
		if (res.code == 200) {
			moreTotal.value = res.data.total
			moreCommentList.value = res.data.data
			oneCommentList.value[indexs.value].children = res.data.data
			// console.log(oneCommentList.value)
		}
	}
	// 获取更多评论
	// const getMoreCommentList = async (id) => {
	// 	uni.showLoading({
	// 		title: '加载中',
	// 		mask: true
	// 	})
	// 	let res = await activeStore.getMoreCommentList({
	// 		comment_id: id,
	// 		page: morePage.value
	// 	})
	// 	if (res.code == 200) {
	// 		uni.hideLoading()
	// 		// oneCommentList.value[indexs.value].children = res.data.data
	// 		if (morePage.value == 1) {
	// 			oneCommentList.value[indexs.value].children = res.data.data
	// 		} else {
	// 			oneCommentList.value[indexs.value].children = oneCommentList.value[indexs.value].children.concat(
	// 				res.data.data)
	// 		}
	// 		if (res.data.current_page >= res.data.last_page) {
	// 			oneCommentList.value[indexs.value].title = '收起'
	// 		} else {
	// 			oneCommentList.value[indexs.value].title = '加载更多'
	// 		}
	// 		// moreCommentList.value = res.data.data
	// 		console.log(oneCommentList.value)
	// 	}
	// }
	// const moreData = (id, index) => {
	// 	morePage.value++
	// 	getMoreCommentList(id)
	// 	indexs.value = index
	// 	// showReplyList.push(id);
	// 	// oneCommentList.value[indexs.value].showReplyList = showReplyList
	// }
	const change = (index) => {
		currentIndex.value = index
	}
	// 展开、收起
	const isShowReply = (id, index) => {
		indexs.value = index
		getMoreCommentList(id)

		if (showReplyList.indexOf(id) == -1) {
			showReplyList.push(id);
			oneCommentList.value[indexs.value].showReplyList = showReplyList

		} else {
			// 收起
			let index = showReplyList.indexOf(id);
			showReplyList.splice(index, 1);
			delete oneCommentList.value[indexs.value].showReplyList
		}
	}
	// 第一层点赞
	// const commentLike = throttle((item) => {
	// 	console.log(item)
	// 	if (item.self_like == 1) {
	// 		// 取消点赞
	// 		activeStore.cancelLikeComment({
	// 			comment_id: item.id
	// 		})
	// 	} else {
	// 		// 点赞
	// 		activeStore.likeComment({
	// 			comment_id: item.id
	// 		})
	// 	}
	// 	getOneCommentList()
	// 	// getMoreCommentList(item.id)
	// }, 200)
	// // 点赞第二层
	// const commentLike2 = throttle((item, oneId) => {
	// 	// console.log(item)
	// 	if (item.self_like == 1) {
	// 		// 取消点赞
	// 		activeStore.cancelLikeComment({
	// 			comment_id: item.id
	// 		})
	// 	} else {
	// 		// 点赞
	// 		activeStore.likeComment({
	// 			comment_id: item.id
	// 		})
	// 	}
	// 	// getOneCommentList()
	// 	getMoreCommentList(oneId)
	// }, 200)
	// 展开、收起
	// const isShowReply = (id, index) => {
	// 	morePage.value = 1
	// 	if (showReplyList.indexOf(id) == -1) {
	// 		getMoreCommentList(id)
	// 		indexs.value = index
	// 		// showReplyList.push(id);
	// 		// item.showReplyList = [id]
	// 		oneCommentList.value[indexs.value].showReplyList = [id]

	// 	} else {
	// 		console.log('收起')
	// 		// 收起
	// 		let index = showReplyList.indexOf(id);
	// 		showReplyList.splice(index, 1);
	// 		delete oneCommentList.value[indexs.value].showReplyList
	// 		delete oneCommentList.value[indexs.value].title
	// 	}
	// }
	// // 点赞
	const commentLike = throttle(async (item) => {
		console.log(item)
		if (item.self_like == 1) {
			// 取消点赞
			let res = await activeStore.cancelLikeComment({
				comment_id: item.id
			})
			if (res.code == 200) {
				item.self_like = 0
				item.like_number--
			}
		} else {
			// 点赞
			let res = await activeStore.likeComment({
				comment_id: item.id
			})
			if (res.code == 200) {
				item.self_like = 1
				item.like_number++
			}
		}
	}, 200)
	// 回复一级评论
	const replyComment = (userNickName, id) => {
		console.log(id)
		iptFocus.value = true;
		placeholderComment.value = '回复@' + userNickName == "微信用户" ? '未知用户' : userNickName;
		parentId.value = id
	}
	// 回复多级评论
	const replyComment2 = (userNickName, id, oneId) => {
		// console.log(userNickName, id,oneId)
		iptFocus.value = true;
		placeholderComment.value = '回复@' + userNickName == "微信用户" ? '未知用户' : userNickName;
		parentId.value = id
		oneDeepId.value = oneId
	}
	// 评论、回复
	const sendCourseComment = async () => {
		let params = {
			user_activity_id: activeId.value,
			content: commentText.value,
			reply_id: parentId.value
		}
		let res = await activeStore.commentActivity(params)
		if (res.code == 200) {
			commentText.value = ''
			placeholderComment.value = '说点什么...'
			parentId.value = 0
			if (oneDeepId.value != '') {
				getMoreCommentList(oneDeepId.value)
			} else {
				getOneCommentList()
			}
			oneDeepId.value = ''
			// getMoreCommentList(oneDeepId.value)
		}
	}
	// 评论区触底加载更多
	const lower = () => {
		
		if (commentLoadStatus.value == 'nomore') {
			return
		}
		commentPage.value++
		getOneCommentList()
	}
	// 添加喜欢
	const addLike = throttle(async () => {
		let res = await activeStore.addLike({
			user_activity_id: activeId.value
		})
		if (res.code == 200) {
			getActiveDetail()
		}
	}, 200)
	// 取消喜欢
	const cancelLike = throttle(async () => {
		let res = await activeStore.cancelLike({
			user_activity_id: activeId.value
		})
		if (res.code == 200) {
			getActiveDetail()
		}
	}, 200)
	// 添加收藏
	const favoriteActivity = throttle(async () => {
		let res = await activeStore.favoriteActivity({
			user_activity_id: activeId.value
		})
		if (res.code == 200) {
			getActiveDetail()
		}
	}, 200)
	// 取消收藏
	const cancelFavoriteActivity = throttle(async () => {
		let res = await activeStore.cancelFavoriteActivity({
			user_activity_id: activeId.value
		})
		if (res.code == 200) {
			getActiveDetail()
		}
	}, 200)
	// 获取打赏金额
	const tippingMoney = async () => {
		let res = await userStore.getConFig({
			type: 'tippingTemplate'
		})
		if (res.code == 200) {
			priceList.value = res.data.content
			rewardRef.value.open()
		}
	}
	const ToReward = () => {
		currentIndex.value = 1
		amount.value = ''
		tippingMoney()
		totalMoney()
	}
	// 活动须知
	const upTips = async () => {
		let res = await userStore.getConFig({
			type: 'activityTips'
		})
		if (res.code == 200) {
			content.value = res.data.content
			showRef.value.open()
		}
	}
	const amountInput = (e) => {
		amount.value = e.detail.value
		if (e.detail.value != '') {
			currentIndex.value = 0
		}
	}
	// 去任务详情
	const gotaskDeatil = (id) => {
		uni.navigateTo({
			url: `/pages/release/taskdetail/index?taskId=${id}`
		})
	}
	// 更换任务
	const deatilTask = async (val, index) => {
		try {
			let obj = {
				lat: uni.getStorageSync('latitude'),
				lng: uni.getStorageSync('longitude'),
				city_id: uni.getStorageSync('cityId'),
				search_order: 3,
				search_type: val.type_id,
				search_text: ''
			}
			let res = await activeStore.getTaskList(obj)


			if (res.code === 200 && Array.isArray(res.data.data) && res.data.data.length > 0) {
				console.log('接口返回:', res.data.data)
				console.log('替换前', activeInfo.value.near_tasks.data[index])
				activeInfo.value.near_tasks.data.splice(index, 1, res.data.data[0])
				console.log('替换后', activeInfo.value.near_tasks.data[index])
			} else {
				console.warn('接口数据不符合预期')
			}
		} catch (error) {
			console.error('出错了', error)
		}
	}
	// 打赏
	const reward = throttle(() => {
		if (amount.value > 0) {
			if (amount.value >= 10) {
				Activity()
			} else {
				uni.showToast({
					title: '最低打赏10星光哦',
					icon: 'none'
				})
			}
		} else {
			console.log(getValueByKey(priceList.value, 'id', currentIndex.value, 'name'))
			Activity()
		}


	}, 200)
	const getValueByKey = (list, searchKey, searchValue, returnKey) => {
		let item = list.find(el => el[searchKey] === searchValue);
		return item ? item[returnKey] : null;
	}
	const Activity = async () => {
		let params = {
			user_activity_id: activeId.value,
			amount: amount.value || '1',
			template_id: currentIndex.value
		}
		let res = await activeStore.tippingActivity(params)
		if (res.code == 200) {
			rewardRef.value.close()
			uni.$uv.toast('打赏成功')
			// rechargeRef.value.open()
		}
	}
	// 获取星光币
	const totalMoney = async () => {
		let res = await userStore.getMoneyAmount()
		totalmoney.value = res
	}
	// 关注or取关
	const follower = throttle(async (type) => {
		if (type == 0) {
			let res = await userStore.followOrClose({
				id: activeInfo.value.user_info.id,
				type: '0'
			})
			if (res.code == 200) {
				uni.$uv.toast('关注成功')
				getActiveDetail()
			}
		} else {
			let res = await userStore.followOrClose({
				id: activeInfo.value.user_info.id,
				type: '1'
			})
			if (res.code == 200) {
				uni.$uv.toast('取关成功')
				getActiveDetail()
			}
		}
	}, 200)
	// 选择要取消的活动
	const selectChange = (e, item) => {
		user_apply_id.value = e
		activeStore.getUserActivityQrcode({
			user_activity_id: activeId.value,
			user_apply_id: e
		}).then(res => {
			if (res.code == 200) {
				SignQrcode.value = res.data.qrcode
				
			}
		})
		currentIndex2.value = e
	}
	// 查看签到码
	const signCode = throttle(async () => {
		let res = await activeStore.SignCode({
			user_activity_id: activeId.value
		})
		if (res.code == 200) {
			signcode.value = res.data.sign_code
			codeRef.value.open()
		}
	}, 200)
	// 复制签到码
	const copy = () => {
		uni.setClipboardData({
			data: signcode.value,
			success: function() {
				console.log('success');
			}
		});
	}
	// 打开拒绝报名弹窗
	const rejectApply = throttle(async (item) => {
		rejectReason.value = ''
		rejectRef.value.open()
		// 活动的报名ID
		applyId.value = item.id
		userId.value = item.user_id
	}, 200)
	// 拒绝报名
	const trueReject = throttle(async () => {
		let params = {
			user_activity_id: activeId.value,
			apply_id: applyId.value,
			reason: rejectReason.value,
			user_id: userId.value
		}
		let res = await activeStore.refuseApply(params)
		if (res.code == 200) {
			uni.$uv.toast('拒绝成功')
			rejectRef.value.close()
			registerRef.value.close()
			getActiveDetail()
			page.value = 1
			applyActiveList.value = []
			getApplyActiveList()
		}
	}, 200)
	// 报名
	const apply = () => {
		uni.navigateTo({
			url: '/pages/activeDetail/application/index?activeId=' + activeId.value + '&payMoney=' + activeInfo
				.value.apply_money + '&payType=' + activeInfo.value.money_type_text
		})
	}
	// 取消报名
	// const cancelApply = async () => {
	// 	cancelApplyRef.value.open()
	// 	myApplyRef.value.close()
	// 	// let res = await activeStore.getApplyActivityUserInfo({user_activity_id:activeId.value})
	// 	// if(res.code==200){
	// 	// 	ApplyActivityUserInfoList.value = res.data
	// 	// 	cancelApplyRef.value.open()
	// 	// }
	// }
	// 签到
	const signApply = async () => {
		signRef.value.open()
		currentIndex2.value = 0
		code.value = ''
	}
	// 取消报名
	const openMyApply = () => {
		cancelApplyRef.value.open()
		currentIndex2.value = 0
	}
	// 确定取消报名
	const trueCancelApply = throttle(async () => {
		let res = await activeStore.trueCancelApply({
			user_activity_id: activeId.value,
			apply_id: currentIndex2.value
		})
		if (res.code == 200) {
			uni.$uv.toast('取消报名成功')
			cancelApplyRef.value.close()
			getActiveDetail()
			page.value = 1
			applyActiveList.value = []
			getApplyActiveList()
		}
	}, 200)
	// 取消活动
	const trueCancelActive = throttle(async () => {
		let res = await activeStore.trueCancelActive({
			user_activity_id: activeId.value
		})
		if (res.code == 200) {
			uni.$uv.toast('取消活动成功')
			cancelActiveRef.value.close()
			getActiveDetail()
		}
	}, 200)
	// 删除已取消活动
	const delActive = throttle(async () => {
		let res = await activeStore.deleteActivity({
			user_activity_id: activeId.value
		})
		if (res.code == 200) {
			uni.$uv.toast('发布活动删除成功')
			delRef.value.close()
			setTimeout(() => {
				uni.switchTab({
					url: '/pages/my/index'
				})
			}, 500)
		}
	}, 200)
	// 确认签到
	const trueSign = throttle(async () => {
		let res = await activeStore.signActivity({
			user_activity_id: activeId.value,
			sign_code: code.value,
			lng: longitude.value,
			lat: latitude.value,
			user_apply_id: user_apply_id.value
		})
		if (res.code == 200) {
			uni.$uv.toast('签到成功')
			signRef.value.close()
			getActiveDetail()
		}
	}, 200)
	// 去发布者主页
	const toUserPage = throttle(() => {
		uni.navigateTo({
			url: '/pages/user/userpage/index?userId=' + activeInfo.value.user_info.id
		})
	}, 200)
	// 加入群聊
	const toGroupChat = () => {
	
		const hasUser = applyActiveList.value.some(item => item.user_id === userStore.userInfo.id)

		// if (!hasUser && ishome!="user") {
		// 	uni.$uv.toast('请先报名')
		// 	return false
		// }
		console.log(222,ishome,hasUser);
		if (ishome.value == "user") {
		 
		 // 搜索群是否存在
		 let promise = chat2.chat.searchGroupByID(activeId.value + '');
		 promise.then(function(imResponse) {
		 	const group = imResponse.data.group; // 群组信息
		 	let join = chat2.chat.joinGroup({
		 		groupID: group.groupID,
		 		type: TencentCloudChat.TYPES.GRP_PUBLIC
		 	});
		 	// console.log(imResponse, '搜索该群')
		 	join.then(function(res) {
		 		// console.log(res, '=============')
		 		switch (res.data.status) {
		 			case TencentCloudChat.TYPES.JOIN_STATUS_WAIT_APPROVAL: // 等待管理员同意
		 				break;
		 			case TencentCloudChat.TYPES.JOIN_STATUS_SUCCESS: // 加群成功
		 				// console.log(res.data.group, '加入成功'); // 加入的群组资料
		 				uni.navigateTo({
		 					url: `/TUIKit/components/TUIChat/index?conversationID=GROUP${res.data.group.groupID}`
		 				});
		 				break;
		 			case TencentCloudChat.TYPES.JOIN_STATUS_ALREADY_IN_GROUP: // 已经在群中
		 				uni.navigateTo({
		 					url: `/TUIKit/components/TUIChat/index?conversationID=GROUP${group.groupID}`
		 				});
		 				break;
		 			default:
		 				break;
		 		}
		 	}).catch(function(imError) {
		 		console.warn('joinGroup error:', imError); // 申请加群失败的相关信息
		 		uni.$uv.toast('加入群聊失败')
		 	});
		 }).catch(function(imError) {
		 	uni.$uv.toast('该群不存在或已被群主解散')
		 	console.warn('searchGroupByID error:', imError); // 搜素群组失败的相关信息
		 });
		 
		} else if (!hasUser) {
		  uni.$uv.toast('请先报名')
		  return false
		}else{
			
			// 搜索群是否存在
			let promise = chat2.chat.searchGroupByID(activeId.value + '');
			promise.then(function(imResponse) {
				const group = imResponse.data.group; // 群组信息
				let join = chat2.chat.joinGroup({
					groupID: group.groupID,
					type: TencentCloudChat.TYPES.GRP_PUBLIC
				});
				// console.log(imResponse, '搜索该群')
				join.then(function(res) {
					// console.log(res, '=============')
					switch (res.data.status) {
						case TencentCloudChat.TYPES.JOIN_STATUS_WAIT_APPROVAL: // 等待管理员同意
							break;
						case TencentCloudChat.TYPES.JOIN_STATUS_SUCCESS: // 加群成功
							// console.log(res.data.group, '加入成功'); // 加入的群组资料
							uni.navigateTo({
								url: `/TUIKit/components/TUIChat/index?conversationID=GROUP${res.data.group.groupID}`
							});
							break;
						case TencentCloudChat.TYPES.JOIN_STATUS_ALREADY_IN_GROUP: // 已经在群中
							uni.navigateTo({
								url: `/TUIKit/components/TUIChat/index?conversationID=GROUP${group.groupID}`
							});
							break;
						default:
							break;
					}
				}).catch(function(imError) {
					console.warn('joinGroup error:', imError); // 申请加群失败的相关信息
					uni.$uv.toast('加入群聊失败')
				});
			}).catch(function(imError) {
				uni.$uv.toast('该群不存在或已被群主解散')
				console.warn('searchGroupByID error:', imError); // 搜素群组失败的相关信息
			});
			
		}

	}
	// 判断是数组中是否包含
	const hasMatchingValue = (value, objectsArray, key) => {
		// 非空处理
		if (!Array.isArray(objectsArray) || objectsArray.length === 0) {
			return false; // 如果数组为空或不是数组，返回 false
		}

		return objectsArray.some(obj => obj[key] === value);
	}
</script>

<style lang="scss" scoped>
	.uv-content {
		padding: 24rpx;
	}

	// 悬浮窗
	.fixed-btn {
		flex-direction: column;
		position: fixed;
		bottom: 200rpx;
		right: 30rpx;
		width: 112rpx;
		height: 112rpx;
		background-color: #FE3052;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
		border-radius: 50%;
		z-index: 1;

		image {
			width: 44rpx;
			height: 44rpx;
		}

		.talk-title {
			width: 92rpx;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			font-weight: 400;
			font-size: 20rpx;
			color: #FFFFFF;
			text-align: center;
		}
	}

	.man-age {
		padding-left: 4rpx;
		font-weight: 400;
		font-size: 20rpx;
		color: #2484FF;
		text-align: center;
	}

	.woman-age {
		padding-left: 4rpx;
		font-weight: 400;
		font-size: 20rpx;
		color: #FF4770;
		text-align: center;
	}

	// 报名列表
	.register-popup {
		padding: 30rpx;

		.register-title {
			display: flex;
			align-items: center;
			justify-content: center;

			.title {
				flex: 1;
				font-weight: bold;
				font-size: 32rpx;
				color: #222222;
				text-align: center;
			}

			.del-btn {
				position: absolute;
				top: 30rpx;
				right: 30rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 50rpx;
				height: 50rpx;

				image {
					width: 32rpx;
					height: 32rpx;
				}
			}
		}

		.reject-tip {
			padding-top: 20rpx;
			font-weight: 400;
			font-size: 28rpx;
			color: #666666;
			text-align: center;
		}

		.reject-title {
			margin-top: 60rpx;
			font-weight: bold;
			font-size: 28rpx;
			color: #222222;
		}

		.code-img {
			margin: 100rpx auto 40rpx auto;
			width: 128rpx;
			height: 128rpx;
			background: #F6F6F6;
			border-radius: 50%;

			image {
				width: 56rpx;
				height: 56rpx;
			}
		}

		.code-number {
			font-weight: bold;
			font-size: 40rpx;
			color: #FE3052;
			text-align: center;
		}

		.copy-btn {
			height: 88rpx;
			background: #FE3052;
			border-radius: 44rpx 44rpx 44rpx 44rpx;
			margin-top: 100rpx;
			font-weight: bold;
			font-size: 28rpx;
			line-height: 88rpx;
			text-align: center;
			color: #FFFFFF;
		}

		.share-to {
			display: flex;
			align-items: center;
			justify-content: flex-start;

			.from-app {
				margin: 80rpx 86rpx 200rpx 0;

				image {
					width: 92rpx;
					height: 92rpx;
				}

				.app-name {
					font-weight: 500;
					font-size: 24rpx;
					color: #333333;
					text-align: center;
				}
			}
		}

		.tips {
			padding: 100rpx 0;
			text-align: center;
			font-weight: bold;
			font-size: 32rpx;
			color: #333;

			.recharge {

				color: #FE3052;
			}
		}

		.tips1 {
			text-align: center;
			font-weight: 400;
			font-size: 28rpx;
			color: #666666;
		}

		.select-cancel {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30rpx;
			margin-top: 20rpx;
			width: 570rpx;
			// height: 154rpx;
			background: #F6F6F6;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
		}

		.apply-info {
			.name-phone {
				padding-bottom: 20rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
			}

			.apply-reason {
				width: 400rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				font-weight: 400;
				font-size: 24rpx;
				color: #666666;
			}
		}

		.select-img {
			image {
				width: 36rpx;
				height: 36rpx;
			}
		}

		.select-cancel2 {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30rpx;
			margin-top: 20rpx;
			width: 570rpx;
			height: 154rpx;
			// background: #F6F6F6;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
		}

		.sign-tip {
			font-weight: 400;
			font-size: 24rpx;
			color: #999999;
		}

		.footer-btn {
			display: flex;
			align-items: center;
			justify-content: space-around;
			margin-top: 100rpx;
			font-weight: bold;
			font-size: 28rpx;
			line-height: 88rpx;
			text-align: center;

			.cancel {
				width: 260rpx;
				height: 88rpx;
				border-radius: 44rpx 44rpx 44rpx 44rpx;
				background: #F6F6F6;
				color: #666666;
			}

			.cancel-apply {
				width: 260rpx;
				height: 88rpx;
				border-radius: 44rpx 44rpx 44rpx 44rpx;
				border: 2rpx solid #FE3052;
				font-weight: bold;
				font-size: 28rpx;
				color: #FE3052;
				line-height: 88rpx;
				text-align: center;
			}

			.confirm {
				width: 260rpx;
				height: 88rpx;
				border-radius: 44rpx 44rpx 44rpx 44rpx;
				background: #FE3052;
				color: #fff;
			}
		}

		.recharge-btn {
			width: 550rpx;
			height: 88rpx;
			background: #FE3052;
			border-radius: 44rpx 44rpx 44rpx 44rpx;
			font-weight: bold;
			font-size: 28rpx;
			color: #FFFFFF;
			line-height: 88rpx;
			text-align: center;
			margin: auto;
		}

		.register-statistics {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 60rpx;

			.line-pink {
				width: 6rpx;
				height: 24rpx;
				background: #FE3052;
				border-radius: 4rpx;
			}

			.register-num {
				padding-left: 12rpx;
				font-weight: bold;
				font-size: 28rpx;
				color: #222;

				.residue-num {
					padding-left: 12rpx;
					color: #FE3052;
				}
			}

			.active-cancel {
				font-weight: bold;
				font-size: 28rpx;
				color: #999999;
			}
		}

		// 打赏
		.money-select-item {
			display: flex;
			align-items: center;
			justify-content: space-around;
			flex-wrap: wrap;

			.select-item {
				display: flex;
				align-items: center;
				justify-content: center;
				margin-top: 30rpx;
				width: 206rpx;
				height: 100rpx;
				background: #F6F6F6;
				border-radius: 12rpx 12rpx 12rpx 12rpx;

				.money-img {
					width: 32rpx;
					height: 32rpx;
				}

				.price {
					font-weight: 400;
					font-size: 28rpx;
				}

				&.active {
					background: #FFF1F3;
					color: #FE3052;
					border: 2rpx solid #FE3052;
				}
			}
		}

		.diy-price {
			padding: 60rpx 0;

			.image-icon {
				display: flex;
				align-items: center;
				border-bottom: 1rpx solid #F6F6F6;
				padding: 18rpx 0;

				image {
					width: 44rpx;
					height: 44rpx;
				}

				.input {
					padding-left: 20rpx;
				}
			}
		}

		.pay-account {

			.account-title {
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
			}

			.account-price {
				display: flex;
				align-items: center;
				margin-top: 30rpx;
				width: 670rpx;
				height: 108rpx;
				background: #F6F6F6;
				border-radius: 20rpx 20rpx 20rpx 20rpx;

				image {
					margin-left: 30rpx;
					width: 44rpx;
					height: 44rpx;
				}

				.account {
					padding: 0 20rpx;
					font-weight: 400;
					font-size: 28rpx;
					color: #222222;
				}

				.price {
					font-weight: 400;
					font-size: 28rpx;
					color: #FE3052;
				}
			}
		}

		.reward-btn {
			margin-top: 60rpx;
			width: 670rpx;
			height: 100rpx;
			line-height: 100rpx;
			background: #FE3052;
			border-radius: 50rpx 50rpx 50rpx 50rpx;
			font-weight: bold;
			font-size: 32rpx;
			color: #FFFFFF;
			text-align: center;
		}

		.rank-list {

			display: flex;
			align-items: center;
			padding-top: 40rpx;

			.avatar-box {
				position: relative;

				image {
					border-radius: 50%;
					width: 124rpx;
					height: 124rpx;
				}

				.number-one {
					position: absolute;
					top: 0;
					left: 0;
					width: 48rpx;
					height: 48rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}
			}

			.rank-info {
				flex: 1;
				margin-left: 24rpx;

				.rank-item {
					display: flex;
					align-items: center;
					height: 64rpx;

					.nickname {
						font-weight: bold;
						font-size: 32rpx;
						color: #222222;
					}

					.relationship {
						margin-left: 12rpx;
						width: 112rpx;
						height: 40rpx;
						background: #FFF1F3;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						line-height: 40rpx;
						text-align: center;
						font-weight: 400;
						font-size: 22rpx;
						color: #FE3052;
					}
				}

				.adress-info {
					display: flex;
					align-items: center;
					margin-top: 22rpx;

					.age-tips {
						display: flex;
						align-items: center;
						justify-content: center;
						width: 88rpx;
						height: 32rpx;
						// padding: 8rpx;
						background: #D9EAFF;
						border-radius: 20rpx;

						image {
							width: 20rpx;
							height: 20rpx;
						}
					}

					.city-address {
						margin-left: 12rpx;
						font-weight: 400;
						font-size: 24rpx;
						color: #666666;
					}
				}

			}

			.invite-btns {
				.reason-btns {
					height: 64rpx;
					line-height: 64rpx;
					text-align: center;
					border-radius: 32rpx 32rpx 32rpx 32rpx;
					border: 2rpx solid #D8D8D8;
					font-weight: 400;
					font-size: 28rpx;
					color: #666666;
				}

				.btns {
					height: 64rpx;
					line-height: 64rpx;
					text-align: center;
					background: #F6F6F6;
					border-radius: 32rpx 32rpx 32rpx 32rpx;
					font-weight: bold;
					font-size: 28rpx;
					color: #666666;
					border: 0;
				}

				.money {
					padding-top: 14rpx;
					font-weight: 400;
					font-size: 24rpx;
					color: #666666;

					.money-num {
						color: #FE3052;
					}
				}
			}
		}

		// 签到信息
		.sign-info {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 20rpx;

			.sign-name {
				font-weight: 400;
				font-size: 24rpx;
				color: #666666;
			}

			.sign-phone {
				font-weight: 400;
				font-size: 24rpx;
				color: #666666;
			}

			.y-sign-state {
				font-weight: 400;
				font-size: 24rpx;
				color: #FE3052;
			}

			.n-sign-state {
				font-weight: 400;
				font-size: 24rpx;
				color: #999;
			}
		}

		.reason {
			padding-top: 20rpx;
			font-weight: 400;
			font-size: 24rpx;
			color: #666666;
		}
	}

	.tips-popup {
		width: 630rpx;

		// height: 748rpx;
		.tips-title {
			padding: 40rpx 0 60rpx 0;
			font-weight: bold;
			font-size: 32rpx;
			color: #222222;
			text-align: center;
		}

		.tips-conent {
			padding: 0 50rpx;
			font-weight: 400;
			font-size: 28rpx;
			color: #222222;
		}

		.know-btn {
			width: 550rpx;
			height: 88rpx;
			background: #FE3052;
			border-radius: 44rpx;
			font-weight: bold;
			font-size: 28rpx;
			color: #FFFFFF;
			line-height: 88rpx;
			text-align: center;
			margin: 60rpx auto 40rpx auto;
		}
	}

	@mixin flex($direction: row) {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: $direction;
	}

	.indicator {
		@include flex(row);
		justify-content: center;

		&__dot {
			height: 10rpx;
			width: 10rpx;
			border-radius: 100px;
			background-color: #FFF1F3;
			margin: 0 12rpx;
			transition: background-color 0.3s;

			&--active {
				background-color: #FE3052;
			}
		}
	}

	.detail-info {
		padding: 40rpx 30rpx;

		.active-pepole-info {
			display: flex;
			align-items: center;
			justify-content: space-between;

			.active-info {
				display: flex;
				align-items: center;
				margin: 20px 0;

				.zlr {
					margin-left: 4rpx;
					margin-top: -12rpx;
					padding: 10rpx;
					background-color: #FE3052;
					color: #fff;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 16rpx;
					width: 84rpx;
					height: 32rpx;
					font-size: 20rpx;
				}

				.active-avatar {
					width: 92rpx;
					height: 92rpx;
					border-radius: 50%;

					.avatar-img {
						width: 100%;
						height: 100%;
						border-radius: 50%;
					}
				}

				.active-nick {
					margin-left: 24rpx;

					.nick {
						display: flex;
						align-items: center;

						.name {
							font-weight: bold;
							font-size: 28rpx;
							color: #222222;
						}

						.concern {
							margin-left: 20rpx;
							width: 88rpx;
							height: 44rpx;
							line-height: 44rpx;
							text-align: center;
							background: #FE3052;
							border-radius: 30rpx;
							font-weight: bold;
							font-size: 20rpx;
							color: #FFFFFF;
						}

						.y-concern {
							margin-left: 20rpx;
							width: 100rpx;
							// height: 44rpx;
							// line-height: 44rpx;
							padding: 4rpx 0;
							border-radius: 22rpx;
							border: 2rpx solid #D8D8D8;
							font-weight: 400;
							font-size: 20rpx;
							color: #666666;
							text-align: center;
						}
					}

					.age-box {
						display: flex;
						align-items: center;
						margin-top: 14rpx;

						.age {
							display: flex;
							align-items: center;
							justify-content: center;
							width: 88rpx;
							height: 32rpx;
							line-height: 32rpx;
							background: #FFF1F3;
							border-radius: 20rpx;

							image {
								width: 20rpx;
								height: 20rpx;
							}

							.age-group {
								font-weight: 400;
								font-size: 20rpx;
								color: #FF4770;
							}
						}

						.self-auth {
							display: flex;
							align-items: center;
							justify-content: center;
							margin-left: 8rpx;
							width: 92rpx;
							height: 36rpx;
							line-height: 36rpx;
							border-radius: 18rpx;
							border: 1rpx solid #1980FF;

							image {
								width: 20rpx;
								height: 20rpx;
							}

							.self {
								font-weight: 400;
								font-size: 22rpx;
								color: #1980FF;
							}
						}

						.qiye-auth {
							display: flex;
							align-items: center;
							justify-content: center;
							margin-left: 8rpx;
							width: 92rpx;
							height: 36rpx;
							line-height: 36rpx;
							border-radius: 18rpx;
							border: 1rpx solid #FFA319;

							image {
								width: 20rpx;
								height: 20rpx;
							}

							.qiye {
								font-weight: 400;
								font-size: 22rpx;
								color: #FFA319;
							}
						}

						.auth {
							width: 90rpx;
							height: 36rpx;
							line-height: 36rpx;
							background: #FFFFFF;
							border-radius: 18rpx;
							border: 1rpx solid #D8D8D8;
							font-weight: 400;
							font-size: 22rpx;
							color: #666666;
							text-align: center;
							margin-left: 8rpx;
						}
					}
				}
			}

			.share-btn {
				display: flex;
				align-items: center;
				align-self: flex-start;

				image {
					width: 32rpx;
					height: 32rpx;
				}

				.share {
					margin-left: 4rpx;
					font-weight: 400;
					font-size: 28rpx;
					color: #222222;
				}
			}


		}

		.active-theme {
			// display: flex;
			// align-items: center;
			margin-top: 30rpx;

			.active-type {
				// display: inline-block;
				// width: 72rpx;
				padding: 0 8rpx;
				line-height: 46rpx;
				height: 46rpx;
				text-align: center;
				background: #FFF1F3;
				border-radius: 8rpx 8rpx 8rpx 8rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 28rpx;
				color: #FE3052;
			}

			.active-title {
				// white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				margin-left: 20rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 800;
				font-size: 36rpx;
				color: #222222;
				flex: 1;

			}
		}

		.active-slogan {
			padding: 20rpx 0 40rpx 0;
			// font-weight: 500;
			font-size: 32rpx;
			color: #222222;
			width: 100%;
			overflow-x: hidden;
		}

		.active-time {
			padding: 10rpx 0;
			font-weight: 500;
			font-size: 24rpx;
			color: #999999;
			width: 100%;
			overflow-x: hidden;
		}

		.active-friend-info {
			background-color: #F3F9FF;
			border-radius: 20rpx;
			border: 2rpx solid #6AAFFF;
			padding: 20rpx 0 40rpx 0;
			font-weight: 500;
			font-size: 32rpx;
			color: #222222;
			width: 100%;
			overflow-x: hidden;
			margin: 30rpx 0;

			.active-friend {
				display: flex;
				align-items: center;
				justify-content: flex-start;
			}

			.info-header {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.title {
					margin: 10rpx 0;

					.left-img {
						width: 30rpx;
						height: 24rpx;
					}

					.middle-title {

						font-family: PingFang SC, PingFang SC;
						font-weight: 800;
						font-size: 32rpx;
						color: #222222;
						text-align: left;
					}

					.right-img {
						width: 24rpx;
						height: 24rpx;
					}
				}

				.active-tips {
					display: flex;
					align-items: center;

					image {
						width: 28rpx;
						height: 28rpx;
					}

					.tips-notice {
						padding-left: 8rpx;
						font-weight: 400;
						font-size: 28rpx;
						color: #1984FF;
					}
				}
			}

		}

		.active-friend-item {
			background-color: #F2F8FF;
			border-radius: 12rpx;
			width: 152rpx;
			height: 112rpx;
			color: #1984FF;
			display: flex;
			border: 1px solid #6AAFFF;
			flex-direction: column;
			align-items: center;
			padding: 10rpx;
			margin: 0 10rpx;

			.active-friend-right {
				width: 28rpx;
				height: 28rpx;
				border-radius: 50%;
				background-color: #1984FF;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}

		.active-detail-hang {
			padding: 20rpx 0 30rpx 100rpx
		}

		// 活动信息
		.time-date {
			padding-top: 30rpx;
			font-weight: 400;
			font-size: 28rpx;
			color: #666666;

			.number {
				margin-left: 10rpx;
				font-size: 32rpx;
				color: #FE3052;
				font-weight: bold;
			}
		}

		.km-num {
			// padding-top: 30rpx;
			font-weight: 400;
			font-size: 28rpx;
			color: #FE3052;
		}

		.active-detail-info {
			width: 690rpx;
			// height: 922rpx;
			background: #FFF9FA;
			border-radius: 20rpx;
			border: 2rpx solid #FFAFBD;

			.info-header {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.title {
					.left-img {
						width: 30rpx;
						height: 24rpx;
					}

					.middle-title {

						font-family: PingFang SC, PingFang SC;
						font-weight: 800;
						font-size: 32rpx;
						color: #222222;
						text-align: left;
					}

					.right-img {
						width: 24rpx;
						height: 24rpx;
					}
				}

				.active-tips {
					display: flex;
					align-items: center;

					image {
						width: 28rpx;
						height: 28rpx;
					}

					.tips-notice {
						padding-left: 8rpx;
						font-weight: 400;
						font-size: 28rpx;
						color: #666666;
					}
				}
			}

			.detail-address {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding-top: 30rpx;
			}

			.enroll {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding-top: 30rpx;

				.enroll-number {
					font-weight: 400;
					font-size: 28rpx;
					color: #666666;

					.number {
						margin-left: 10rpx;
						font-size: 36rpx;
						color: #FE3052;
						font-weight: bold;
					}
				}
			}

			// 头像组
			.enroll-avator-box {
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin: 20rpx 0 60rpx 0;

				.enroll-avator {
					display: flex;
					flex-wrap: wrap;
					align-content: flex-start;

					.avator-group {
						position: relative;
						width: 50rpx;
						height: 68rpx;
						border: 1px silid #000;
						margin-bottom: 0;

						image {
							width: 68rpx;
							height: 68rpx;
							border-radius: 50%;
							object-fit: cover;

						}

						.ranking {
							position: absolute;
							top: -8rpx;
							left: -10rpx;

							image {
								width: 40rpx;
								height: 40rpx;
							}
						}
					}


				}

				.more {
					width: 30rpx;
					// height: 6rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}

				.check-number {
					width: 68rpx;
					height: 68rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}
			}

			.strength {
				width: 610rpx;
				height: 100rpx;
				border-radius: 50rpx;
				border: 2rpx solid #D8D8D8;
				font-weight: bold;
				font-size: 32rpx;
				color: #999999;
				line-height: 100rpx;
				text-align: center;
			}

			.reject-reason {
				padding-top: 30rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #999999;
			}

			.application {
				width: 610rpx;
				height: 100rpx;
				line-height: 100rpx;
				background: #FE3052;
				border-radius: 50rpx;
				font-weight: bold;
				font-size: 32rpx;
				color: #FFFFFF;
				text-align: center;
			}

			.cancel-application {
				width: 610rpx;
				height: 100rpx;
				border-radius: 50rpx 50rpx 50rpx 50rpx;
				border: 2rpx solid #FE3052;
				font-weight: bold;
				font-size: 32rpx;
				color: #FE3052;
				line-height: 100rpx;
				text-align: center;
			}

			.my-application {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.cancel-apply-btn {
					width: 290rpx;
					height: 100rpx;
					line-height: 100rpx;
					border-radius: 50rpx 50rpx 50rpx 50rpx;
					border: 2rpx solid #FE3052;
					font-weight: bold;
					font-size: 32rpx;
					color: #FE3052;
					text-align: center;
				}

				.sign-apply-btn {
					width: 290rpx;
					height: 100rpx;
					background: #FE3052;
					border-radius: 50rpx;
					font-weight: bold;
					font-size: 28rpx;
					color: #FFFFFF;
					line-height: 100rpx;
					text-align: center;
				}

				// width: 610rpx;
				// height: 100rpx;
				// border-radius: 50rpx 50rpx 50rpx 50rpx;
				// border: 2rpx solid #222;
				// font-weight: bold;
				// font-size: 32rpx;
				// color: #222;
				// line-height: 100rpx;
				// text-align: center;
			}

			.more-btns {
				justify-content: space-between;

				.cancel-application {
					width: 290rpx;
				}

				.signin {
					width: 290rpx;
					height: 100rpx;
					border-radius: 50rpx 50rpx 50rpx 50rpx;
					border: 2rpx solid #111111;
					font-weight: bold;
					font-size: 32rpx;
					color: #222222;
					line-height: 100rpx;
					text-align: center;
				}
			}
		}

		// 评论区
		.total-comment {
			padding: 60rpx 0;
			font-weight: 400;
			font-size: 28rpx;
			color: #666666;
		}

		.comment-kong {
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			padding-bottom: 150rpx;

			.kong-icon {
				width: 560rpx;
				height: 310rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.text-kong {
				font-weight: 400;
				font-size: 28rpx;
				color: #999999;
			}
		}

		// 评论区
		.zwz-comment {
			// height: 1000rpx;
			background-color: #fff;
			overflow: scroll;
		}

		.zwz-comment .comment-num {
			text-align: center;
			color: #c1c6cc;
			// height: 40rpx;
			margin-top: 10rpx;
		}

		.comment-item-main {
			margin-bottom: 40rpx;

			.comment-item {
				display: flex;
				padding: 0 20rpx;

				.left {
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
					overflow: hidden;

					.img {
						width: 80rpx;
						height: 80rpx;
					}
				}

				.content {
					flex: 1;
					margin: 0 20rpx;

					.title-name {
						font-weight: 400;
						font-size: 28rpx;
						color: #666666;

						view {
							max-width: 150rpx;
							display: inline-block;
							margin-right: 20rpx;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
						}
					}

					.content-text {
						/* width: 480rpx; */
						font-size: 28rpx;
						margin: 20rpx 0;
					}

					.content-btm {
						color: #bbbbbb;
						margin-bottom: 20rpx;

						.btm-back {
							margin-left: 40rpx;
							font-weight: 400;
							font-size: 24rpx;
							color: #666666;
						}
					}
				}

				.right {
					height: 70rpx;

					.img-like {
						display: flex;
						align-items: center;
						flex-direction: column;

						image {
							display: block;
							width: 36rpx;
							height: 36rpx;
							margin-top: 20rpx;
						}
					}
				}
			}

			.spread {
				color: #FE3052;
				margin-left: 80rpx;
				height: 17px;
				position: relative;

				.down {
					width: 0;
					height: 0;
					position: absolute;
					margin-left: 5px;
					top: 7px;
					border-right: 8px solid transparent;
					border-left: 8px solid transparent;
					border-bottom: 8px solid transparent;
					border-top: 8px solid #FE3052;
				}

				.up {
					width: 0;
					height: 0;
					position: absolute;
					margin-left: 5px;
					bottom: 4px;
					border-right: 8px solid transparent;
					border-left: 8px solid transparent;
					border-bottom: 8px solid #FE3052;
					border-top: 8px solid transparent;
				}
			}
		}

		.items {
			margin-left: 80rpx;
		}

		.comment-btm {
			height: 100rpx;
			width: 100%;
			display: flex;
			/* position: absolute; */
			bottom: 0;
			background-color: #fff;
			border-top: 2rpx solid #e0e0e0;

			input {
				height: 80rpx;
				width: 400rpx;
				border-radius: 20rpx;
				background-color: #f3f3f3;
				margin-left: 80rpx;
				margin-top: 10rpx;
				padding: 10rpx;
			}

			button {
				height: 80rpx;
				margin-top: 10rpx;
			}
		}

		.comment-like-num {
			display: inline-block;
			width: 50rpx;
			text-align: center;
		}
	}

	.footer {
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 128rpx;
		background-color: #fff;
		// border-top: 1rpx solid #ccc;
		box-shadow: 0rpx -2rpx 0rpx 2rpx #F6F6F6;
		display: flex;
		align-items: center;
		justify-content: space-around;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		box-sizing: content-box;

		.input-comment {
			display: flex;
			align-items: center;
			width: 400rpx;
			// height: 80rpx;
			background: #F6F6F6;
			border-radius: 40rpx;

			.writer-icon {
				padding: 0 12rpx 0 30rpx;

				image {
					width: 32rpx;
					height: 32rpx;
				}
			}

			.input-box {
				height: 80rpx;
			}
		}

		.give-gift {
			.gift-icon {
				width: 48rpx;
				height: 48rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.title {
				font-weight: bold;
				font-size: 24rpx;
				color: #FF5475;
				text-align: center;
			}
		}

		.collent {
			.collent-icon {
				width: 48rpx;
				height: 48rpx;

				image {
					width: 100%;
					height: 100%;
				}

			}

			.collent-number {
				font-weight: bold;
				font-size: 24rpx;
				color: #222222;
				text-align: center;
			}
		}

		.delete-btn {
			width: 330rpx;
			height: 88rpx;
			border-radius: 50rpx 50rpx 50rpx 50rpx;
			border: 1rpx solid #FE3052;

			image {
				width: 44rpx;
				height: 44rpx;
			}

			.del {
				padding-left: 8rpx;
				font-weight: 400;
				font-size: 32rpx;
				color: #FE3052;
				text-align: center;
			}
		}
	}

	.footer_flex {}

	.swiper-container {
		width: 100%;
	}

	.custom-tag-content {
		display: flex;
		flex-direction: column;
		line-height: 1.2;
	}

	.line2 {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.arrow {
		margin-left: 4px;
	}

	.uv-qrcode {
		position: static !important;
	}

	// .eqrcode{
	// 	display: flex;
	// 	left: 50%;
	// 	top: 50%;
	// 	transform: translate(calc(50%-200rpx),calc(50%-200rpx));
	// }
</style>